import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:flutter_study_app/app/router/routers.dart';
import 'package:flutter_study_app/module/case_clear/view/case_clear_item_view.dart';
import 'package:flutter_study_app/widget/my_app_bar.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class CaseClearListPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _CaseClearListPageState();
}

class _CaseClearListPageState extends State<CaseClearListPage> {
  TextEditingController _textSearchController = TextEditingController();
  FocusNode _searchFocus = FocusNode();
  bool _showToTopBtn = false;
  ScrollController _controller = ScrollController();

  @override
  void initState() {
    super.initState();
    _controller.addListener(() {
      if (_controller.offset < 500 && _showToTopBtn) {
        setState(() {
          _showToTopBtn = false;
        });
      } else if (_controller.offset >= 500 && _showToTopBtn == false) {
        setState(() {
          _showToTopBtn = true;
        });
      }
    });
  }

  @override
  void dispose() {
    _controller.dispose();
    _textSearchController.dispose();
    super.dispose();
  }

  Widget _buildSearchView() {
    return Container(
      color: Colors.white,
      padding:
          EdgeInsets.only(left: 12.w, top: 10.w, right: 10.w, bottom: 10.w),
      child: Container(
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(20.w)),
          color: Color(0xff000000).withOpacity(0.04),
        ),
        height: 35.w,
        child: Row(
          children: [
            SizedBox(
              width: 13.w,
            ),
            Icon(
              Icons.search,
              color: Color(0xff999999),
              size: 20.w,
            ),
            Expanded(
              child: TextFormField(
                focusNode: _searchFocus,
                controller: _textSearchController,
                style: TextStyle(
                  fontSize: 14.sp,
                ),
                textInputAction: TextInputAction.search,
                decoration: InputDecoration(
                  isDense: true,
                  contentPadding: EdgeInsets.zero,
                  fillColor: Colors.transparent,
                  filled: true,
                  hintText: '请输入立案编号后4~5位或客户姓名',
                  border:
                      OutlineInputBorder(borderSide: BorderSide.none), // 去掉下滑线
                  counterText: '', // 去除输入框底部的字符计数
                  suffixIcon: _textSearchController.text.isNotEmpty
                      ? InkWell(
                          onTap: () {
                            ///搜索框中 删除 按钮 点击
                            _textSearchController.text = "";

                            setState(() {});
                          },
                          child: Container(
                            padding: EdgeInsets.symmetric(horizontal: 12.w),
                            child: Image.asset(
                              "assets/images/icon_xx_clear.png",
                              width: 16.w,
                              height: 16.w,
                            ),
                          ),
                        )
                      : null,
                  suffixIconConstraints:
                      BoxConstraints(maxWidth: 50.w, maxHeight: 20.w),
                  // labelText: 'Email',
                ),
                onFieldSubmitted: (text) {
                  String str = _textSearchController.text.toString();
                  if (str == null || str.trim().isEmpty) {
                    EasyLoading.showToast('请输入商户名称');
                    return;
                  }
                },
                onChanged: (str) {
                  if (str == null || str.isEmpty) {}
                  setState(() {});
                },
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(
        title: '立案清算',
        rightMenu: InkWell(
          onTap: () {
            Routers.navigateTo(context, Routers.caseClearEditPage);
          },
          child: Container(
            padding: EdgeInsets.only(left: 20.w, right: 12.w),
            child: Image.asset(
              'assets/images/cs_report_add.png',
              width: 18.w,
              height: 18.w,
            ),
          ),
        ),
      ),
      body: Column(
        children: [
          Container(
            height: 1.w,
            color: Color(0xFFEEEEEE),
          ),
          _buildSearchView(),
          Expanded(
              child: ListView.builder(
            controller: _controller,
            itemCount: 10,
            itemBuilder: (context, index) {
              return InkWell(
                  onTap: () {
                    Routers.navigateTo(context, Routers.caseClearDetailPage);
                  },
                  child: Column(
                    children: [
                      CaseClearItemView(),
                      Container(
                        height: 10.w,
                        color: Color(0xFFF7F7F7),
                      ),
                    ],
                  ));
            },
          )),
        ],
      ),
      floatingActionButton: !_showToTopBtn
          ? null
          : GestureDetector(
              child: Image.asset(
                'assets/images/cs_to_top.png',
                width: 60.w,
                height: 60.w,
              ),
              onTap: () {
                //返回到顶部时执行动画
                _controller.animateTo(
                  .0,
                  duration: Duration(milliseconds: 200),
                  curve: Curves.ease,
                );
              }),
    );
  }
}
